<template>
	<view class="main">
		
		<view class="main-item flex justify-between">
			<view class="main-left"><image src="../static/images/xiangshan.jpeg" mode=""></image></view>
			<view class="main-right">
				<view class="margin-left"><span>散拼</span>|香山码头帆船出海体验票</view>
				<view class="box flex justify-start margin-top">
				<u-tag text="帆船" type="success" border-color="#F1A33A" mode="plain" color="#F1A33A" class="margin-left"/>
				<u-tag text="单票" type="success" border-color="#F1A33A" mode="plain" color="#F1A33A" class="margin-left-xs"/>
				<u-tag text="1小时" type="success" border-color="#F1A33A" mode="plain" color="#F1A33A"  class="margin-left-xs"/>
				</view>
				<view class="rightBottom flex justify-between margin-left margin-top">
					
					<view class="address"><u-icon name="map-fill" class="margin-right-xs"></u-icon>厦门香山码头</view>
					<view class="price">￥76</view>
				</view>
			</view>
		</view>
		<view class="introduce margin-tb">
			<view class="intro-item">
				<view class="text-cut">地理位置优越，和金门距离不足5公里，隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望隔海相望</view>
			</view>
		</view>
	</view>
</template>

<script>
</script>

<style>
	.main{
		margin: 30upx;
	}
	.main .introduce{
		overflow: hidden;
		text-overflow:ellipsis;
		white-space: nowrap;
		height: 80upx;
		line-height: 80upx;
		background-color:#F5FBFE;
		color:#56B2F9 ;
	}
	.main .main-left{
		width: 45%;
	}
	.main .main-item .main-left image{
		width: 100%;
		height: 220upx;
	}
	.main .main-item .main-right{
		width: 55%;
	}
	.main .main-item .main-right .box .box-item{
		border: 1px solid #F1A33A;
		border-radius: 15upx;
	}
	.main .main-item .main-right .rightBottom .address{
		color: #A1A1A1;
		font-size: 12upx;
	}
	.main .main-item .main-right .rightBottom .price{
		color: #EC612A;
		font-size: 16upx;
	}
</style>
